
<template>
  <div class="c-minh" :class="[listType == 3 ? 'bg-ffefe6' : (listType == 5 || listType == 4) ? 'c-bg-sgray' : '']">
    <div class="c-bg-sgray c-p c-ph24 c-pt24" :class="formList && formList.length <= 6 ? 'c-h100vh' : ''" v-if="listType==1">
      <div class="c-bg-white c-ph24 c-br16">
        <div class="c-fs32 c-fw-b c-fc-xblack c-pv24 c-bd-b1 c-w100">
          {{hasSubType ? 'subName' : custNameMap[memberInfo.vipType]}}<router-link :to="{path:'/homePage/agent/agentInfo'}" class="icon iconfont c-fw-n c-fs28 c-fc-f2 c-ml10">&#xe715;</router-link>
        </div>
        <div class="c-fs24 c-fc-sblack c-pv24 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
          <div class="">昵称</div>
          <div class="">{{partnerData.nickname}}</div>
        </div>
        <div class="c-fs24 c-fc-sblack c-pv24 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
          <div class="c-ws-n c-ww130"><span class="c-fc-xmlred c-pr5">*</span>真实姓名</div>
          <div class="c-flex-row c-justify-end c-flex-1"><input type="text" maxlength="10" v-model="realName" placeholder="请输入真实姓名" class="c-textAlign-r c-fs24 c-bd0 input c-w80" :class="realName == '' ? 'c-fc-gray' : 'c-fc-xblack'" /></div>
        </div>
        <div class="c-fs24 c-fc-sblack c-pv24 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
          <div class="c-ws-n"><span class="c-fc-xmlred c-pr5">*</span>手机号</div>
          <div class=""><input type="text" v-model="mobile" placeholder="请输入手机号" class="c-textAlign-r c-fs24 c-bd0 input" :class="mobile == '' ? 'c-fc-gray' : 'c-fc-xblack'" /></div>
        </div>
        <div class="c-fs24 c-lh34 c-fc-xblack c-pv12 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center"
          v-if="(agentConf.enableEditMobile ==1 && isShowCode == '') || (agentConf.enableEditMobile ==1 && isShowCode != mobile)">
          <div class="c-ww140 c-ws-n c-hh34 c-flex-shrink0"><span class="c-fc-xmlred c-pr5">*</span>图片验证码</div>
          <input type="text" v-model="imgCode" maxlength="4" placeholder="请输入图片验证码" class="c-textAlign-r c-fs24 c-bd0 input c-hh34 c-ww220 c-ws-n" :class="imgCode == '' ? 'c-fc-sgray' : 'c-fc-xblack'" />
          <div class="c-ww166 c-hh64 c-flex-shrink0">
            <img :src="$addXossFilter(codeImgInfo.img)" alt="" class="c-w100 c-h" @click="getImgCode">
          </div>
        </div>
        <div class="c-fs24 c-lh34 c-fc-xblack c-pv28 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center"
          v-if="(agentConf.enableEditMobile ==1 && isShowCode == '') || (agentConf.enableEditMobile ==1 && isShowCode != mobile)">
          <div class="c-ww120 c-ws-n"><span class="c-fc-xmlred c-pr5">*</span>验证码</div>
          <input type="text" v-model="code" @input="code=code.slice(0, 4)" maxlength="4" placeholder="请输入短信验证码" class="c-textAlign-r c-fs24 c-bd0 input c-ww200" :class="code == '' ? 'c-fc-sgray' : 'c-fc-xblack'" />
          <div class="fc-f6 c-ph20">|</div>
          <div class="c-ws-n" @click="getYzcode" :class="yzText == '获取验证码' ? 'theme-fc c-ww120' : 'c-fc-gray c-ww180'">{{yzText}}</div>
        </div>
        <div class="c-fs24 c-fc-sblack c-pv24 c-w100 c-flex-row c-justify-sb c-aligni-center" :class="userExtra.areaAgentArea ? 'c-bd-b1' : ''">
          <div class="c-fc-sblack c-ws-n"><span class="c-fc-xmlred c-pr5">*</span>所在地</div>
          <div class="c-flex-row result" v-if="addressData">
            <x-address :themeColor="$getThemeColor()" title="" v-model="addrValue" :list="addressData" placeholder="请选择地址" :show.sync="showAddress" class="input" :class="addrValue.length == 0 ? 'c-fc-gray' : 'fc-xblack'">
            </x-address><i class="iconfont c-fs20 c-fc-gray c-pl10">&#xe60e;</i>
          </div>
        </div>
        <div class="c-fs24 c-fc-sblack c-pv24 c-w100 c-flex-row c-justify-sb c-aligni-center" v-if="userExtra.areaAgentArea">
          <div class="">代理区域</div>
          <div class="">{{userExtra.areaAgentArea}}</div>
        </div>
      </div>
      <div class="c-bg-white c-br16 c-ph24 c-mt20" v-if="formList && formList.length > 0">
        <div v-for="(item, index) in formList" :key="index">
          <div v-if="item.type == 1">
            <div class="c-fs24 c-lh34 c-pv24 c-w100 c-flex-row c-aligni-center" :class="formList.length - 1 != index ? 'c-bd-b1' : ''">
              <div class="c-ws-n c-ww130 c-fc-sblack"><span class="c-fc-xmlred c-pr5" v-if="item.status">*</span>{{item.title}}</div>
              <div class="c-flex-row c-justify-end c-flex-1"><input type="text" v-model="item.value" :placeholder="`请输入${item.title}`" class="c-textAlign-r c-fs24 c-bd0 input c-w80" :class="item.value && item.value != '' ? 'c-fc-xblack' : 'c-fc-gray'"/></div>
            </div>
          </div>
          <div v-else class="c-fs24 c-lh34 c-pv24 c-w100 c-flex-row c-justify-sb c-aligni-center" :class="formList.length - 1 != index ? 'c-bd-b1' : ''">
            <div class="c-ws-n c-fc-sblack"><span class="c-fc-xmlred c-pr5" v-if="item.status">*</span>{{item.title}}</div>
            <div class="c-flex-row result">
              <popup-picker :themeColor="$getThemeColor()" class="selectPicker" :data="getSubTitle(item.subTitle)" v-model="item.value" :placeholder="`请选择${item.title}`" @on-change="onChanage(index, item.value)">
              </popup-picker><i class="iconfont c-fs20 c-fc-gray c-pl10">&#xe60e;</i>
            </div>
          </div>
        </div>
      </div>
      <div v-if="protocolInfoHasAgreed" class="c-bg-white c-br16 c-ph24 c-mt20">
        <div class="c-fs24 c-lh34 c-pv24 c-w100 c-flex-row c-aligni-center" @click.stop="clickProtocol(protocolInfoHasAgreed[0])">
          <div class="c-ws-n c-ww130 c-fc-sblack">已同意协议</div>
          <div class="c-flex-row c-justify-end c-flex-grow1 iconfont c-fs20 c-fc-gray">&#xe60e;</div>
        </div>
      </div>
      <div class="c-bd-t1 c-pf c-p-l0 c-p-b0 c-w100 c-w100 c-maxw640 c-bg-white c-pz100 c-ph24 c-flex-column c-justify-sa box-shadow c-hh88">
        <div @click="submitFormInfo" class="c-fc-white c-br36 c-hh64 c-textAlign-c c-ph10 theme-bg c-fs26 c-lh64">保存</div>
      </div>
      <open-modal :needCloseBtn="true" :openModal='popProtocols' @closeModal='popProtocols = false'>
        <div class="c-bg-white c-pt26 c-pb40 c-br-tl20 c-br-tr20 c-ph24 c-hh400">
          <div class="c-w100 c-textAlign-c c-fs28 c-lh40 c-pt20 c-fc-xblack c-fw-b c-pb24">请选择协议</div>
          <div @click="clickProtocols(item, index)" v-for="(item, index) in protocolInfoHasAgreed" :key="index" :class="[index == 0 ? 'c-bd-t1' : '', index == selectProtocolsIndex ? 'c-fc-sgray' : 'c-fc-sblack']" class="c-fs26  c-hh80 c-lh80 c-bd-b1 protocol-name">{{item.name}}</div>
        </div>
      </open-modal>
    </div>

    <div class="c-pt24 c-ph30 c-pb36 c-bg-sgray" :class="isGivenQuota == 1 ? '' : 'c-h100vh'" v-if="listType==2">
      <div class="c-br10 c-text-hidden">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center">
          <div class="c-bd-b1 c-flex-grow1 c-flex-row c-justify-sb c-pb20 c-aligni-center">
            <div class="c-fs26 c-mt4">VIP</div>
            <div v-if='partnerData.vipRemainingQuota>0 && this.isVipEnable == 1 && isOpenVip ==1 && useQuotaType != 0' @click="clickGive(0)" class="c-fs20 c-fc-white c-ww70 c-hh36 c-br4 theme-bg c-flex-row c-flex-center">赠送</div>
          </div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32 c-w100">{{partnerData.vipGivenQuota - partnerData.vipRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32 c-w100">{{partnerData.vipRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <div class="c-br10 c-text-hidden c-mt32" v-if="companyAuth.enableSvipModule == 1">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center">
          <div class="c-bd-b1 c-flex-grow1 c-flex-row c-justify-sb c-pb20 c-aligni-center">
            <div class="c-fs26 c-mt4">SVIP</div>
            <div v-if='partnerData.svipRemainingQuota>0 && this.isSvipEnable == 1 && isOpenSvip ==1 && useQuotaType != 0' @click="clickGive(1)" class="c-fs20 c-fc-white c-ww70 c-hh36 c-br4 theme-bg c-flex-row c-flex-center">赠送</div>
          </div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{partnerData.svipGivenQuota - partnerData.svipRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{partnerData.svipRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <div class="c-br10 c-text-hidden c-mt32">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center">
          <div class="c-bd-b1 c-flex-grow1 c-flex-row c-justify-sb c-pb20 c-aligni-center">
            <div class="c-fs26 c-mt4">金额</div>
          </div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32 c-w100">{{(Number(userExtra.moneyGivenQuota) - Number(userExtra.moneyRemainingQuota)).toFixed(2)}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用金额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32 c-w100">{{Number(userExtra.moneyRemainingQuota).toFixed(2)}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余金额</div>
          </div>
        </div>
      </div>
      <div v-if="companyAuth.agentLevels >= 1 && isGivenQuota == 1">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center c-mt32">
          <div class="c-bd-b1 c-flex-grow1 c-pb20 c-hh60 c-fs26">{{customName.agentName}}</div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agentGivenQuota - userExtra.agentRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agentRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <div v-if="companyAuth.agentLevels >= 2 && isGivenQuota == 1">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center c-mt32">
          <div class="c-bd-b1 c-flex-grow1 c-pb20 c-hh60 c-fs26">{{customName.partnerName}}</div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.partnerGivenQuota - userExtra.partnerRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.partnerRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <div v-if="companyAuth.agentLevels >= 3 && isGivenQuota == 1">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center c-mt32">
          <div class="c-bd-b1 c-flex-grow1 c-pb20 c-hh60 c-fs26">{{customName.branchName}}</div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.branchGivenQuota - userExtra.branchRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.branchRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <div v-if="companyAuth.agentLevels >= 4 && isGivenQuota == 1">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center c-mt32">
          <div class="c-bd-b1 c-flex-grow1 c-pb20 c-hh60 c-fs26">{{customName.cooName}}</div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center c-box-shadow3-bottom">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.cooGivenQuota - userExtra.cooRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.cooRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <div v-if="companyAuth.agentLevels >= 5 && isGivenQuota == 1">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center c-mt32">
          <div class="c-bd-b1 c-flex-grow1 c-pb20 c-hh60 c-fs26">{{customName.agencyName}}</div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center c-box-shadow3-bottom">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agencyGivenQuota - userExtra.agencyRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agencyRemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <div v-if="companyAuth.agentLevels >= 6 && isGivenQuota == 1">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center c-mt32">
          <div class="c-bd-b1 c-flex-grow1 c-pb20 c-hh60 c-fs26">{{customName.agent6Name}}</div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center c-box-shadow3-bottom">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agent6GivenQuota - userExtra.agent6RemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agent6RemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <div v-if="companyAuth.agentLevels >= 7 && isGivenQuota == 1">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center c-mt32">
          <div class="c-bd-b1 c-flex-grow1 c-pb20 c-hh60 c-fs26">{{customName.agent7Name}}</div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center c-box-shadow3-bottom">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agent7GivenQuota - userExtra.agent7RemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agent7RemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <div v-if="companyAuth.agentLevels >= 8 && isGivenQuota == 1">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center c-mt32">
          <div class="c-bd-b1 c-flex-grow1 c-pb20 c-hh60 c-fs26">{{customName.agent8Name}}</div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center c-box-shadow3-bottom">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agent8GivenQuota - userExtra.agent8RemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agent8RemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <div v-if="companyAuth.agentLevels >= 9 && isGivenQuota == 1">
        <div class="c-bg-white c-fc-xblack c-pt24 c-ph24 c-w100 c-flex-row c-aligni-center c-mt32">
          <div class="c-bd-b1 c-flex-grow1 c-pb20 c-hh60 c-fs26">{{customName.agent9Name}}</div>
        </div>
        <div class="c-bg-white c-fc-xblack c-pv30 c-ph100 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center c-box-shadow3-bottom">
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agent9GivenQuota - userExtra.agent9RemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">已用名额</div>
          </div>
          <div>
            <div class="c-textAlign-c c-fc-xblack c-fs32">{{userExtra.agent9RemainingQuota}}</div>
            <div class="c-mt5 c-fs22 c-fc-sblack">剩余名额</div>
          </div>
        </div>
      </div>
      <share-member @changeYearsType="changeYearsType" @goPresent="goPresent" :defaultPlaceholder="agentConf && agentConf.quotaDesc ? agentConf.quotaDesc : ''" :hasYearVip="ableSubmit" :giveType="giveType" :vipNum="partnerData.vipRemainingQuota" :svipNum="partnerData.svipRemainingQuota" :supportType="supportType" :isShowPresent="isShowPresent" :vipType="arrIndex" :typeTem="defaultType" :isSvipEnable="isSvipEnable" :isVipEnable="isVipEnable" v-if="isShowPresent" @closePresent="isShowPresent=false;"></share-member>
    </div>

    <div class="bg-ffefe6 courseShareholder" v-if="listType == 3">
      <div class="bt-wrapper">
        <div class="c-flex-row wrapper-list c-fs24 c-textAlign-c">
          <div class="c-pv24 c-flex-1 c-flex-column c-p" :class="spreadTabIndex == 0 ? 'c-fs26 c-fc-C96000' : 'c-fs24 c-fc-E4A772'" @click="changeSpreadTab(0)">
            <div>课程</div>
            <div :class="spreadTabIndex == 0 ? 'tab-icon bg-brown ' : ''"></div>
          </div>
          <div class="c-pv24 c-flex-1 c-flex-column c-p" :class="spreadTabIndex == 1 ? 'c-fs26 c-fc-C96000' : 'c-fs24 c-fc-E4A772'" @click="changeSpreadTab(1)">
            <div>优惠券</div>
            <div :class="spreadTabIndex == 1 ? 'tab-icon bg-brown ' : ''"></div>
          </div>
        </div>
        <div class="c-pt24" v-show="spreadTabIndex == 0">
          <spread-money-temp :bg="'bg-ffefe6'" :fc="'c-fc-C96000'" :inputBg="'c-bg-FEE3D5'"></spread-money-temp>
        </div>
        <div v-show="spreadTabIndex == 1" class="c-ph24 c-pt24 c-fs20">
          <div class="c-ph20 c-bg-white c-br12 c-mb20" v-for="(item, index) in exchangeCodeList" :key="index">
            <div class="c-bd-b1 c-pv20 c-flex-row" @click="goCouponDetail(item.redeemCodeId)">
              <div class="c-flex-column c-justify-sa c-aligni-center c-br10 c-ww120 c-hh132 coupon-left c-textAlign-c">
                <div class="c-fs28 c-fw-b c-fc-xlblown" v-if="item.type == 2 || item.type == 3 || item.type == 5 || item.type == 6">
                  <span v-if="item.type == 2 || item.type == 5"><span class="c-fw-n" v-if="item.type == 2">{{'￥' | iosPriceFilter}}</span>{{Number(item.price)}}<span v-if="item.type == 5">折</span></span>
                  <span v-if="item.type == 3 || item.type == 6"><span class="c-fw-n">{{'￥' | iosPriceFilter}}</span><span>{{Number(item.price)}}</span></span>
                </div>
                <div class="c-fs18 c-fc-sblown">
                  <span v-if="item.type == 3 && item.subType == 1">免费券</span>
                  <span v-else-if="item.type != 3">{{couponType[item.type]}}</span>
                  <span v-else>满{{item.amount}}</span>
                </div>
              </div>
              <div class="c-flex-column c-justify-sb c-ml20 c-flex-grow1 c-w0 c-hh130">
                <div class="c-flex-column">
                  <div class="c-flex-row c-justify-sb c-aligni-center">
                    <div class="c-fs24 c-fc-xblack">{{item.name.length > 12 ? `${item.name.substr(0, 12)}...` : item.name }}</div>
                    <div class="c-ws-n" :class="item.status == 2 ? 'c-fc-xmlred' : 'c-fc-gray'">{{couponStatus[item.status]}}</div>
                  </div>
                  <div v-if="item.validStatus != 1 && item.validStatus != 2" class="c-fs18 c-fc-gray c-mt8 c-text-ellipsis1">有效期：{{item.startAt.split(" ")[0]}}至{{item.endAt.split(" ")[0]}}</div>
                  <div v-else class="c-fs18 c-fc-gray c-text-ellipsis1 c-mt8">{{item.validStatus == 1 ? ('领券当日起' + item.validPeriod + '天内可用') : ('领券次日起' + item.validPeriod + '天内可用')}}</div>
                  <span class="c-fc-gray c-mt8">剩余 {{item.leftNum}} 已推广 {{item.collectedNum}}</span>
                </div>
                <div class="c-flex-row c-aligni-center c-justify-end">
                  <div class="c-fc-white bg-gradient c-pv8 c-fs18 c-br32 c-ph30" v-if="item.status == 1 || item.status == 2" @click.stop="shareCoupon(item);">推广</div>
                </div>
              </div>
            </div>
            <div class="c-flex-row c-justify-sa c-pv20 c-fs22 c-fc-xblue">
              <div class="c-w33 c-textAlign-c" @click="clickListItem(item.redeemCodeId)">查看详情</div>
              <div class="c-w33 c-textAlign-c c-bd-l1" @click="goExchange(item.redeemCodeId)">领取明细</div>
              <div class="c-w33 c-textAlign-c c-bd-l1" @click="doCopy(item.encRedeemCodeId)" v-if="item.status == 1 || item.status == 2">复制链接</div>
            </div>
          </div>
          <loading-status-tem :noData="exchangeCodeList.length == 0" :noMoreData="is_page == false && (exchangeCodeList.length > 0)" :noDataText="spreadTabIndex == 0 ? '暂无课程' : '暂无优惠券'"></loading-status-tem>
        </div>
      </div>
    </div>

    <div class="c-pb32" v-if="listType==4">
      <div :class="courseList && courseList.length > 0 ? 'c-bg-sgray c-pb10':''">
        <my-small-tabbar :tabList="vipList" :tabIndex="tabIndex" @changeTab="changeType" class="c-bg-white"></my-small-tabbar>
      </div>
      <div class="c-ph24">
        <div class="c-bg-white c-mt20 c-pv30 c-ph20 c-flex-row c-justify-sb c-aligni-center c-br12" v-for="(item, index) in courseList" :key="index">
          <div class="c-flex-row c-justify-sb c-aligni-center c-w82">
            <div class="c-bd1 c-ww150 c-maxh100 c-text-hidden c-flex-shrink0 c-br10 c-p">
              <vip-custom-img :cover="item.vipInfo ? item.vipInfo.cover : {}" :imgClass="'c-block c-maxh'" :prodType="item.type==6 || item.type==7 || item.type==15 || item.type==17 || item.type==19 || item.type==21 || item.type==31 ? 1 : 23" :hasText="false" />
            </div>
            <div class="c-flex-column c-justify-sa c-hh100 c-ml22 c-flex-grow1 c-w0">
              <span class="c-text-ellipsis1 c-fs26 c-fc-xblack">{{item.desc}}</span>
              <span class="c-fs20 c-fc-gray">{{item.createdAt}}</span>
            </div>
          </div>
          <div class="c-w18 c-textAlign-r" @click="goDetail(item)">
            <span class="c-pv10 c-ph20 c-fs18 c-fc-white theme-bg c-br10">查看</span>
          </div>
        </div>
      </div>
      <loading-status-tem :noData="courseList.length == 0" :noMoreData="is_page == false && (courseList.length > 0)" :noDataText="'暂无相关记录'" :showLoading="isLoading"></loading-status-tem>
    </div>

    <div class="c-pb32" v-if="listType==5">
      <my-small-tabbar class="c-bg-white" id="tabhBar" :tabList="tabList" :tabIndex="typeBar" @changeTab="changeListType" :key="typeBar"></my-small-tabbar>
      <template v-if="typeBar==1">
        <div class="c-ph24" v-if="quotaConsumeList.length>0 && quotaConsumeList">
          <div v-for="(item, index) in quotaConsumeList" :key="index" class="c-bg-white c-fs26 c-fc-xblack c-ph20 c-pv30 c-mt20 c-flex-row c-br10">
            <img :src="$addXossFilter(item.from == 1 ? (require('../../../assets/defult_head2.png') || require('../../../assets/defult_head.png')) : (item.headimgurl ? item.headimgurl : require('../../../assets/defult_head.png')))" class="c-ww48 c-hh48 c-br40" />
            <div class="c-flex-column c-justify-center c-ml20 c-w0 c-flex-grow1">
              <div class="c-lh36 c-fs26 c-flex-row c-justify-sb c-aligni-center">
                <span>{{item.from==1 ? "系统操作" : (item.from==7 ? "取消服务商身份" : item.nickname)}}</span>
                <span class="c-fs26 c-lh36 theme-fc">{{String(item.num>0 ? '+' : '') + Number(item.num).toFixed(0)}}</span>
              </div>
              <div class="c-lh36 c-fs24 c-pt20 c-fc-gray" v-if="item.from==1">{{(item.num>0 ? '平台赠送' : '平台回收') + `(${item.vipTypeName})`}}</div>
              <div class="c-lh36 c-fs24 c-pt20 c-fc-gray" v-else-if="item.from==2">{{'名额消耗'+ `(${item.vipTypeName})`}}</div>
              <div class="c-lh36 c-fs24 c-pt20 c-fc-gray" v-else-if="item.from==3 || item.from==5">{{(item.num>0 ? '服务商分卡赠送' : '服务商分卡消耗')+ `(${item.vipTypeName})`}}</div>
              <div class="c-lh36 c-fs24 c-pt20 c-fc-gray" v-else-if="item.from==4 || item.from==6">{{(item.num>0 ? '服务商分卡回退' : '服务商分卡回收')+ `(${item.vipTypeName})`}}</div>
              <div class="c-lh36 c-fs24 c-pt20 c-fc-gray" v-else-if="item.from==7">{{item.vipTypeName}}</div>
              <div class="c-lh36 c-fs24 c-pt20 c-fc-gray" v-if="item.rNickname">推荐人：{{item.rNickname}}</div>
              <div class="c-fc-gray c-fs22 c-lh28 c-pt26">{{item.createdAt}}</div>
            </div>
          </div>
        </div>
        <loading-status-tem :noData="quotaConsumeList.length == 0" :noMoreData="is_page == false && (quotaConsumeList.length > 0)" :noDataText="'暂无消耗记录'" :showLoading="isLoading"></loading-status-tem>
      </template>
      <template v-if="typeBar==2">
        <div class="c-ph24" v-if="moneyConsumeList && moneyConsumeList.length > 0">
          <div v-for="(item, index) in moneyConsumeList" :key="index" class="c-bg-white c-fs26 c-fc-xblack c-ph20 c-pv30 c-mt20 c-br10">
            <div class="c-w100 c-flex-column">
              <div class="c-flex-row c-aligni-center c-justify-sb c-w100">
                <div class="c-flex-row c-w60">
                  <img :src="$addXossFilter(item.from == 1 ? (require('../../../assets/defult_head2.png') || require('../../../assets/defult_head.png')) : (item.headimgurl ? item.headimgurl : require('../../../assets/defult_head.png')))" class="c-ww48 c-hh48 c-brp50" />
                  <div class="c-flex-column c-ml20 c-w100">
                    <div class="c-fs26 c-lh40 c-fc-xblack c-text-ellipsis1">{{item.from == 1 ? (item.num>0 ? '系统充值' : '商家调整') : (item.from == 7 ? "取消服务商身份" : (item.nickname || '未知'))}}</div>
                  </div>
                </div>
                <div class="c-fs26 c-lh36 theme-fc">{{String(item.num>0 ? '+' : '') + Number(item.num).toFixed(2)}}</div>
              </div>
              <div class="c-lh36 c-fs24 c-fc-gray c-pt8 c-ml68" v-if="item.from==3 || item.from==5">{{(item.num>0 ? '服务商分卡赠送' : '服务商分卡消耗')}}</div>
              <div class="c-lh36 c-fs24 c-fc-gray c-pt8 c-ml68" v-if="item.from==4 || item.from==6">{{(item.num>0 ? '服务商分卡回退' : '服务商分卡回收')}}</div>
            </div>
            <div class="c-pt20 c-w100 c-flex-column c-justify-center c-pl48 c-fc-gray">
              <div class="c-pl20 c-flex-row c-justify-sb c-pb20" v-if="item.prodName">
                <div class="c-fs24 c-flex-row c-lh40 c-flexw-wrap">
                  <div class="c-flex-row c-w100" v-for="(_item, index) in showWhole(item)" :key="item._id.$_oid+index">
                    <!-- <span class="c-flex-shrink0 c-pr10">{{'-'}}</span> -->
                    <span><span v-if="item.prodType">【{{prodMapType[item.prodType]}}】</span>{{_item}}</span>
                  </div>
                </div>
                <div class="c-pl32 c-fs22 c-flex-shrink0" @click="item.showWhole=!item.showWhole" v-if="item.prodName.length>1">
                  <span>{{'全部'}}</span>
                  <i class="iconfont c-fs20">{{item.showWhole==false ? '&#xe6a9;' : '&#xe6ab;'}}</i>
                </div>
              </div>
              <span class="c-pl20 c-fs24 c-pb20" v-if="item.prodType == cfrom.activity && item.actInfo">
                票种：{{item.actInfo.name}}
              </span>
              <span class="c-pl20 c-fs24 c-pb20" v-if="item.rNickname">
                推荐人：{{item.rNickname}}
              </span>
              <span class="c-pl20 c-fs22">
                {{item.cTime}}
              </span>
            </div>
          </div>
        </div>
        <loading-status-tem :noData="moneyConsumeList.length == 0" :noMoreData="is_page == false && (moneyConsumeList.length > 0)" :noDataText="'暂无消耗记录'" :showLoading="isLoading"></loading-status-tem>
      </template>
    </div>
    <my-loading :showLoading="isLoading"></my-loading>
    <div v-if="(agentVersion == 3 || agentVersion == 5) && isShowShareQuota == 1 && listType==2" class="c-pf c-p-b0 c-w100 c-maxw640 c-hh120 c-flex-row c-justify-center c-aligni-center c-ph24 c-bg-white c-box-shadow2" @click="goToSubCardSetting">
      <div class="c-flex-row c-justify-center c-aligni-center c-w100 c-hh80 c-br10" :class="partnerData.vipRemainingQuota <= 0 && partnerData.svipRemainingQuota <= 0 && Number(userExtra.moneyRemainingQuota).toFixed(2) <= 0 ? 'c-bg-ccc': 'theme-bg'">
        <div class="c-fc-white c-fs28">代理商分卡</div>
      </div>
    </div>
    <share-poster v-if="posterInfo && listType == 3" :typeStr="typeStr" :showPoster="showPoster" :posterInfo="posterInfo" @closePoster="showPoster = false;"></share-poster>
  </div>
</template>

<script>
import loadingStatusTem from "@/components/templates/common/loadingStatusTem.vue";
import shareMember from "@/components/templates/shareMember.vue";
import VipCustomImg from "@/components/templates/common/VipCustomImg.vue";
import MySmallTabbar from "@/components/templates/common/MySmallTabbar.vue";
import { utilJs } from "@/utils/common.js";
import { XAddress, PopupPicker } from 'ckjrweb-mp-ui/src/components/index';
import myLoading from "@/plugin/loading/loading.vue";
import SharePoster from "@/components/homePage/shareholder/sharePoster.vue"
import SpreadMoneyTemp from "@/components/templates/spreadMoneyTemp.vue";
import OpenModal from "@/components/templates/common/openModal.vue";
let isLoadding = false;
export default {
  name: "AgentDetail",
  components: {
    XAddress,
    PopupPicker,
    shareMember,
    VipCustomImg,
    MySmallTabbar,
    myLoading,
    loadingStatusTem,
    SharePoster,
    SpreadMoneyTemp,
    OpenModal
  },
  props: [],
  beforeCreate() { },
  data() {
    return {
      theme: localStorage.getItem("colorName") ? localStorage.getItem("colorName") : 'mb5_default',
      memberInfo: "", // 登录会员信息
      addrValue: [],
      showAddress: false,
      addressData: '', // addressData,
      name: "", // 姓名
      realName: "",
      mobile: "", // 手机号
      num: 60,
      yzText: "获取验证码",
      imgCode: '',
      code: '',
      isYz: true,
      codeImgInfo: {},
      isShowCode: "",
      sfValue: [], // 身份类型
      partnerData: "",
      isShowBtn: false, // 是否显示审核中按钮
      isShowFail: false, // 是否显示审核失败
      isShowPartner: false, // 是否显示服务商信息
      companyAuth: JSON.parse(localStorage.getItem("companyAuth")),
      shareLogo: window.localStorage.getItem("shareLogo"),
      isShowPresent: false,
      giveType: 0,
      ableSubmit: true,
      listType: -1, //1：基础资料 2：名额管理3：兑换码管理4：赠送记录 5：名额消耗明细 6：金额消耗明细
      exchangeCodeList: [],
      userExtra: {
        'agentGivenQuota': 0,
        'agentRemainingQuota': 0,
        'branchGivenQuota': 0,
        'branchRemainingQuota': 0,
        'partnerGivenQuota': 0,
        'partnerRemainingQuota': 0,
        'moneyGivenQuota': 0,
        'moneyRemainingQuota': 0
      },
      isGivenQuota: 0,
      quotaConsumeList: [],
      moneyConsumeList: [],
      is_page: false,
      page: 1,
      limit: 10,
      tabIndex: 2,
      courseList: [],
      tabList: [{
        title: '名额流水记录',
        index: 1,
      }, {
        title: '金额流水记录',
        index: 2,
      }],
      vipList: [
        {index: 2, title: 'VIP'},
        {index: 4, title: 'SVIP'}
      ],
      typeBar: 1,
      isLoading: false,
      customName: JSON.parse(localStorage.getItem("customName")),
      // vipTypeArr: ["（普通用户）", "（VIP）", "（代理商）", "（SVIP）", "（合伙人）", "（分公司）"],
      prodMapType: global.prodMapType,
      isShowShareQuota: 0, // 是否显示分卡入口
      subTypeArr: [], //服务商拓展名称
      hasSubType: false,
      subName: "", //服务商名字
      userExtend: {}, //五级代理新增两级服务商
      supportType: [], //后台自定义会员类型
      defaultType: 0, //匹配到后台设置服务商赠送vip(svip)名额第一个会员
      isVipEnable: false, //后台是否开启服务商赠送vip名额
      isSvipEnable: false, //后台是否开启服务商赠送svip名额
      arrIndex: 0, //匹配到后台第一个开启服务商赠送vip(svip)的索引
      isOpenVip: 0, // 包月 包季度 包半年 包一年 包两年 包三年 长期有效,至少开启一个为1
      isOpenSvip: 0, // 同上
      custNameMap: {}, //服务商自定义名称
      agentVersion: 0, //0非代理 1平台板，3渠道版，5五级代理
      useQuotaType: 1, //1 既支持直接同学购买会员消耗名额，也支持赠送给同学消耗名额 0:只能通过直接同学购买会员消耗名额
      agent: '',
      agentConf: '',
      formList: [], //服务商接收自定义字段
      formArr: [], //服务商自定义字段传后端
      spreadTabIndex: 0, //0单品课程, 1代金券
      couponType: {
        1: "兑换码",
        2: "免费券",
        3: "满减券",
        4: "抵价券",
        5: "折扣券",
        6: "付费券"
      },
      couponStatus: {
        1: "未开始",
        2: "进行中",
        3: "已停止",
        4: "已过期",
        5: "已作废"
      },
      posterInfo: null,
      showPoster: false,
      typeStr: '',
      protocolInfoHasAgreed: null,
      popProtocols: false,
      selectProtocolsIndex: -1,
      cfrom: global.ckFrom
    };
  },
  created() {
    utilJs.appShare(this);
  },
  mounted() {
  },
  computed: {},
  watch: {
    mobile() {
      if (this.mobile && isNaN(this.mobile)) {
        this.mobile = "";
      } else if (this.mobile && this.mobile.length > 11) {
        this.mobile.substr(0, 11);
      }
    }
  },
  methods: {
    clickProtocol(item) {
      if (this.protocolInfoHasAgreed && this.protocolInfoHasAgreed.length > 1) {
        this.popProtocols = true;
        return;
      }
      this.$routerGo(this, "push", { path: `/homePage/agent/protocolInfo`, query: { protocolId: item.protocolId } });
    },
    clickProtocols(item, pIndex) {
      this.selectProtocolsIndex = pIndex;
      setTimeout(() => {
        this.$routerGo(this, "push", { path: `/homePage/agent/protocolInfo`, query: { protocolId: item.protocolId } });
      }, 100)
    },
    doCopy(redeemCodeId) {
      let content = `${window.location.href.split("#")[0]}#/homePage/giftCode/${redeemCodeId}?isScan=1&type=1&agentId=${localStorage.getItem("userId")}&refereeId=${localStorage.getItem("userId")}`
      utilJs.copyText(content);
    },
    changeSpreadTab(tabIndex) {
      this.spreadTabIndex = tabIndex;
      if (tabIndex == 1 && this.exchangeCodeList.length == 0) {
        this.page = 1;
        this.exchangeCodeList = [];
        this.getMore();
      }
    },
    getImgCode() {
      if (this.isLoading == true) {
        return;
      }
      this.isLoading = true;
      utilJs.getMethod(`${global.apiurl}common/captcha`, res => {
        this.codeImgInfo = res;
        this.isLoading = false;
      }, failRes => {
        this.isLoading = false;
      });
    },
    getYzMethod: function () {
      this.isYz = false;
      this.num -= 1;
      this.yzText = this.num + "秒后重新获取";
      if (this.num == 0) {
        clearInterval(this.interval);
        this.yzText = "获取验证码";
        this.isYz = true;
        this.num = 60;
        this.isClick = false;
      }
    },
    getYzcode: function () {
      if (!this.isClick) {
        this.isClick = true;
        if (!!this.mobile) {
          if (this.imgCode == '') {
            this.$showCjToast({
              text: "图片验证码不能为空",
              type: "warn",
            });
            this.isClick = false;
          } else {
            let $this = this;
            $this.yzText = "发送中";
            utilJs.postMethod(global.apiurl + "members/sendCode", {
              mobile: this.mobile,
              captcha: this.imgCode,
              captchaKey: this.codeImgInfo.key,
            }, res => {
              if (res.errMsg) {
                $this.yzText = "获取验证码";
                $this.isClick = false;
                $this.$showCjToast({
                  text: res.errMsg,
                  type: "warn",
                });
              } else {
                $this.interval = setInterval($this.getYzMethod, 1000);
              }
            }, function () {
              clearInterval($this.interval);
              $this.yzText = "获取验证码";
              $this.isYz = true;
              $this.num = 60;
              $this.isClick = false;
            })
          }
        } else {
          this.$showCjToast({
            text: "手机号不能为空",
            type: "warn",
          });
          this.isClick = false;
        }
      }
    },
    submitFormInfo() {
      let isCardInfo = false;
      let isMustInfo = false;
      if (!this.realName || this.realName.length < 1) {
        this.$showCjToast({
          text: "请输入真实姓名",
          type: "warn",
        });
        return;
      } else if (!this.mobile || this.mobile.length == 0) {
        this.$showCjToast({
          text: "请填写手机号",
          type: "warn",
        });
        return;
      } else if (this.mobile.length < 7 || this.mobile.length > 11) {
        this.$showCjToast({
          text: "请填写正确手机号",
          type: "warn",
        });
        return;
      } else if (((this.agentConf.enableEditMobile == 1 && this.isShowCode == '') || (this.agentConf.enableEditMobile == 1 && this.isShowCode != this.mobile)) && this.imgCode.length < 4) {
        this.$showCjToast({
          text: "请输入图片验证码",
          type: "warn",
        });
        return;
      } else if (((this.agentConf.enableEditMobile == 1 && this.isShowCode == '') || (this.agentConf.enableEditMobile == 1 && this.isShowCode != this.mobile)) && this.code.length < 4) {
        this.$showCjToast({
          text: "请输入验证码",
          type: "warn",
          time: 3000
        });
        return;
      } else if (this.addrValue.length <= 0) {
        this.$showCjToast({
          text: "请选择所在地",
          type: "warn",
        });
        return;
      }
      if (this.formList.length > 0) {
        this.formList.forEach((item, index) => {
          if (item.default == 2 && item.status == false && item.value != '') {
            isCardInfo = true;
          }
          if (isCardInfo == true && item.default == 1 && item.value == '') {
            this.$showCjToast({
              text: "请填写证件号码",
              type: "warn",
            });
            isMustInfo = true;
            return;
          }
          if (isMustInfo == true) {
            return;
          }
          if (item.status == true && !item.value) {
            this.$showCjToast({
              text: "请填写信息",
              type: "warn",
            });
            isMustInfo = true;
            return;
          } else {
            // type: 1 文本框, 2 下拉选项
            if ((item.type == 1 && item.status == true) || (item.type == 1 && item.status == false && !!item.value)) {
              this.formArr.push({id: item.id, content:item.value, default: item.default})
            } else if ((item.type == 2 && item.status == true) || (item.type == 2 && item.status == false && !!item.value)) {
              this.formArr.push({id: item.id, content: item.value[0], default: item.default})
            }
          }
        })
        if (isMustInfo == true) {
          this.formArr = [];
          return;
        }
      }
      if (isLoadding) {
        return;
      }
      let data = {
        name: this.name,
        mobile: this.mobile,
        realName: this.realName,
        provinceId: this.addrValue[0],
        cityId: this.addrValue[1],
        areaId: this.addrValue[2],
        code: this.code,
        aaId: this.agent.aaId,
        form: this.formArr
      }
      isLoadding = true;
      utilJs.postMethod(global.apiurl + 'Agent/saveAgentForm', data, res => {
        isLoadding = false;
        this.formArr = [];
        if (this.agentConf.enableEditMobile) {
          this.agentConf.enableEditMobile = 0;
        }
        this.$showCjToast({
          text: '保存成功',
          type: 'text',
        });
      }, failres => {
        isLoadding = false;
      });
    },
    getSubTitle(subTitle) {
      if (!subTitle) {
        return;
      }
      let list = [];
      list[0] = [];
      for (let index in subTitle) {
        list[0].push(subTitle[index].title);
      }
      return list;
    },
    onChanage(i, value) {
      if (this.agent.auditStatus == -3) {
        this.formList[i].value = [value[0]];
      }
      this.$forceUpdate()
    },
    goToSubCardSetting() {
      if (this.partnerData.vipRemainingQuota <= 0 && this.partnerData.svipRemainingQuota <= 0 && Number(this.userExtra.moneyRemainingQuota).toFixed(2) <= 0) {
        return;
      }
      this.$routerGo(this, "push", { path: "/homePage/agent/subCardSetting" });
    },
    clickGive(giveType) {
      this.ableSubmit = true;
      this.isShowPresent = true;
      this.giveType = giveType;
      this.getDefaultIndex();
    },
    getApplyPage() {
      utilJs.getMethod(global.apiurl + "members/agentApplyPage", res => {
        this.memberInfo = res.userInfo;
        this.name = res.userInfo.nickname;
        this.realName = res.userInfo.realName;
        this.mobile = res.userInfo.mobile;
        this.isShowCode = res.userInfo.mobile;
        this.supportType = res.supportType;
        this.agentVersion = res.agentVersion;
        this.formList = res.form;
        this.agentConf = res.agentConf;
        this.protocolInfoHasAgreed = res.protocol && res.protocol.length > 0 ? res.protocol : null;
        if (this.listType == 1 && (this.protocolInfoHasAgreed == null || this.protocolInfoHasAgreed == undefined || (this.protocolInfoHasAgreed && this.protocolInfoHasAgreed.length == 0))) {
          utilJs.getMethod(`${global.apiurl}protocols/getProtocolByProdType?prodType=42`, (res) => {
            this.protocolInfoHasAgreed = res.protocol && res.protocol.length > 0 ? res.protocol : null;
          });
        }
        if (res.agentConf.enableEditMobile && res.agentConf.enableEditMobile == 1) {
          this.getImgCode();
        }
        if (res.form.length > 0) {
          res.form.forEach((item, index) => {
            if (item.type && item.type == 2) {
              if (!!item.content) {
                this.formList[index].value = [item.content];
              } else {
                this.formList[index].value = [];
              }
            } else {
              if (!!item.content) {
                this.formList[index].value = item.content;
              } else {
                this.formList[index].value = "";
              }
            }
          })
        }
        res.supportType.vip.forEach((item, index) => {
          if (item.enable == true) {
            this.isOpenVip = 1;
          }
        })
        res.supportType.svip.forEach((item, index) => {
          if (item.enable == true) {
            this.isOpenSvip = 1;
          }
        })
        this.isSvipEnable = res.supportType.isSvipEnable;
        this.isVipEnable = res.supportType.isVipEnable;
        this.getDefaultIndex();
        this.subTypeArr = this.memberInfo ? this.memberInfo.subTypeName : [];
        if (this.memberInfo && this.memberInfo.hasSubType == 1 && this.subTypeArr && this.subTypeArr.length > 0) {
          this.hasSubType = true;
          res.userInfo.subType = res.userInfo.subType ? res.userInfo.subType : 0;
          let tItem = this.subTypeArr.filter((item) => {
            return item.subType == res.userInfo.subType;
          })
          if (tItem && tItem.length > 0) {
            this.subName = tItem[0].name;
          }
        }
        if (res.userExtra != null) {
          this.userExtra = res.userExtra;
        }
        if (res.agentVersion == 5 && !!res.userExtend) {
          this.userExtend = res.userExtend;
        }
        if (res.agentConf != null) {
          if (res.agentConf.isGivenQuota != null) {
            this.isGivenQuota = res.agentConf.isGivenQuota; //是否开启代理名额编辑
          }
          this.isShowShareQuota = res.agentConf.isShareQuota;
          this.useQuotaType = res.agentConf.useQuotaType;
        }
        if (res.userInfo.provinceId && res.userInfo.cityId && res.userInfo.areaId) {
          this.addrValue = [
            "" + res.userInfo.provinceId,
            "" + res.userInfo.cityId,
            "" + res.userInfo.areaId
          ];
        }
        if (res.agent != null) {
          // 申请表中有数据
          this.agent = res.agent;
          if ([2, 3, 4, 5].includes(res.agent.auditStatus)) {
            // 审核通过
            if (
              res.userInfo.vipType == 1 ||
              res.userInfo.vipType == 2 ||
              res.userInfo.vipType == 4
            ) {
              this.isShowPartner = false;
              this.isShowFail = false;
              this.isShowBtn = false;
              this.name = "";
              this.realName = "";
              this.mobile = "";
              this.sfValue = [];
              return false;
            } else {
              this.partnerData = res.agent;
              this.isShowPartner = true;
              this.isShowFail = false;
            }
          } else {
            this.isShowPartner = false;
            if (res.agent.auditStatus == 1) {
              // 审核中
              this.isShowBtn = true;
              this.isShowFail = false;
              this.name = res.agent.nickname;
              this.realName = res.agent.realName;
              this.mobile = res.agent.mobile;
              this.sfValue = [this.custNameMap[res.agent.vipType]];
              if (
                res.agent.provinceId != null &&
                res.agent.cityId != null &&
                res.agent.areaId != null
              ) {
                this.addrValue = [
                  "" + res.agent.provinceId,
                  "" + res.agent.cityId,
                  "" + res.agent.areaId
                ];
              }
            } else if (res.agent.auditStatus == -1) {
              // 审核失败
              this.isShowFail = true;
              this.isShowBtn = false;
            } else {
              this.isShowFail = false;
              this.isShowBtn = false;
            }
          }
        } else {
          // 用户表身份 没经过申请表
          this.partnerData = res.userInfo;
          if (
            this.partnerData.vipType == 3 ||
            this.partnerData.vipType >= 5
          ) {
            this.isShowPartner = true;
            this.isShowFail = false;
          } else {
            this.isShowPartner = false;
            this.isShowFail = false;
          }
        }
      });
    },
    goPresent(giveInfo) {
      if (this.isLoading) {
        return;
      }
      let $this = this;
      this.isLoading = true;
      utilJs.postMethod(global.apiurl + 'members/presents', giveInfo, function (res) {
        if (res.hasYearVip) {
          $this.$routerGo($this, "push", {
            path: "/homePage/course/presentCourse",
            query: {
              presentId: res.presentId,
              memberFrom: 'agent'
            }
          });
        } else {
          $this.ableSubmit = false;
        }
        $this.isLoading = false;
      },
        failRes => {
          $this.isLoading = false;
        });
    },
    getQuotaConsumeList: function () {
      let $this = this;
      if (this.isLoading) {
        return;
      }
      this.isLoading = true;
      utilJs.getMethod(global.apiurl + 'members/quotaConsumeList?limit=' + this.limit + '&page=' + this.page, function (res) {
        $this.isLoading = false;
        $this.quotaConsumeList = res.data ? $this.quotaConsumeList.concat(res.data) : [];
        $this.page = res.data && (res.data.length >= $this.limit) ? ($this.page + 1) : $this.page;
        $this.is_page = res.data && (res.data.length >= $this.limit) ? true : false;
      },
        failRes => {
          $this.isLoading = false;
        }
      )
    },
    getMoneyConsumeList() {
      let $this = this;
      if (this.isLoading) {
        return;
      }
      this.isLoading = true;
      utilJs.getMethod(global.apiurl + 'members/moneyConsumeList?limit=' + this.limit + '&page=' + this.page, function (res) {
        $this.isLoading = false;
        let tempData = res.data ? res.data : [];
        for (let i = 0; i < tempData.length; i++) {
          tempData[i].showWhole = false;
          if (tempData[i].prodName && (typeof tempData[i].prodName == 'string') && tempData[i].prodName.constructor == String) { //prodName为字符串时转换成数组，显示默认以数组处理
            tempData[i].prodName = [tempData[i].prodName];
          }
        }
        $this.moneyConsumeList = $this.moneyConsumeList.concat(tempData);
        $this.page = res.data && (res.data.length >= $this.limit) ? ($this.page + 1) : $this.page;
        $this.is_page = res.data && (res.data.length >= $this.limit) ? true : false;
      },
        failRes => {
          $this.isLoading = false;
        }
      );
    },
    showWhole(item) {
      if (item.showWhole) {
        return item.prodName;
      } else {
        return item.prodName.slice(0, 1);
      }
    },
    changeYearsType: function () {
      this.ableSubmit = true;
    },
    clickListItem(rId) { // 因为优惠券支持多个服务商，所以要传具体从哪个服务商分享出来的
      this.$routerGo(this, "push", {
        path: `/homePage/giftCode/${rId}`,
        query: { isScan: 1, type: 1, agentId: localStorage.getItem("userId") }
      });
    },
    getMore() {
      let $this = this;
      if (this.isLoading) {
        return;
      }
      this.isLoading = true;
      let url = 'redeemCodes?page=' + this.page;
      utilJs.getMethod(global.apiurl + url, function (res) {
        $this.isLoading = false;
        $this.exchangeCodeList = res.redeemList.data ? $this.exchangeCodeList.concat(res.redeemList.data) : [];
        $this.page = res.redeemList.current_page < res.redeemList.last_page ? ($this.page + 1) : $this.page;
        $this.is_page = res.redeemList.current_page < res.redeemList.last_page ? true : false;
      },
        failRes => {
          $this.isLoading = false;
        }
      );
    },
    goDetail: function (item) {
      this.$routerGo(this, "push", {
        path: "/homePage/course/presentCourse",
        query: {
          presentId: item.presentId,
          memberFrom: 'agent'
        }
      });
    },
    changeType(tabIndex) {
      this.tabIndex = tabIndex;
      this.courseList = [];
      this.page = 1;
      this.is_page = false;
      this.getMorePresent();
    },
    changeListType(type) {
      if (this.typeBar != type) {
        this.typeBar = type;
        this.quotaConsumeList = [];
        this.moneyConsumeList = [];
        this.page = 1;
        this.is_page = false;
        if (type == 1) {
          this.getQuotaConsumeList();
        } else {
          this.getMoneyConsumeList();
        }
      }
      return false;
    },
    getMorePresent() {
      if (this.isLoading) {
        return;
      }
      let $this = this;
      this.isLoading = true;
      utilJs.getMethod(global.apiurl + 'members/presentList?vipType=' + this.tabIndex + '&page=' + this.page, function (res) {
        if ($this.page == 1) {
          $this.courseList = res.present.data ? res.present.data : [];
        } else {
          let list = res.present.data;
          $this.courseList = $this.courseList.concat(list);
        }
        $this.page = res.present.current_page < res.present.last_page ? ($this.page + 1) : $this.page;
        $this.is_page = res.present.current_page < res.present.last_page ? true : false;
        $this.isLoading = false;
      }, failRes => {
        $this.isLoading = false;
      });
    },
    getDefaultIndex() {
      if (this.giveType == 0) {
        if (this.isVipEnable == 1) {
          this.arrIndex = this.supportType.vip.findIndex((value, index, arr) => {
            return value.enable;
          })
          if (this.arrIndex != -1) {
            this.isOpenVip = 1;
            this.defaultType = this.supportType.vip[this.arrIndex].presentType;
          } else {
            // 包月 - 长期有效等七种模式都没开启
            this.isOpenVip = 0;
          }
        }
      } else {
        if (this.isSvipEnable == 1) {
          this.arrIndex = this.supportType.svip.findIndex((value, index, arr) => {
            return value.enable;
          })
          if (this.arrIndex != -1) {
            this.isOpenSvip = 1;
            this.defaultType = this.supportType.svip[this.arrIndex].presentType;
          } else {
            this.isOpenSvip = 0;
          }
        }
      }
    },
    //分享
    wechatShare: function () {
      utilJs.wechatConfig("", "", "", "", function () { });
    },
    //手机端分享
    appShare: function () {
      utilJs.appShareTrue("", "", "", "");
    },
    windowScrollAgentFunction: function () {
      let that = this;
      utilJs.handleLoading(function () {
        if (that.is_page == true && that.listType == 3) {
          that.getMore();
        } else if (that.is_page == true && that.listType == 4) {
          that.getMorePresent();
        } else if (that.is_page == true && that.listType == 5) {
          if (that.typeBar == 1) {
            that.getQuotaConsumeList();
          } else {
            that.getMoneyConsumeList()
          }
        }
      });
    },
    shareCoupon(item) {
      let shareUrl =
        window.location.href.split("#")[0] +
        `#/homePage/giftCode/${item.encRedeemCodeId}?isScan=1&type=1&agentId=${localStorage.getItem("userId")}&refereeId=${localStorage.getItem("userId")}`
      this.posterInfo = {
        uname: localStorage.getItem("userName"),
        uheadImg: localStorage.getItem("userHeadImg"),
        url: shareUrl,
        price: item.type == 1 || item.type == 4 ? this.couponType[item.type] : item.type == 5 ? Number(item.price) + '折' : Number(item.price),
        name: item.name,
        statusStr: item.redeemType == 24 ? '指定商品可用' : item.redeemType == 25 ? '适用于商城商品' : item.redeemType == 26 ? '全店商品可用' : item.redeemType == 114 ? '适用于预约师资功能' : item.redeemType == 27 ? ("适用于" + (item.prodTypes ? item.prodTypes.join('、') : '')) : '',
        timeStr: item.validStatus == 1 ? "领券当日起" + item.validPeriod + '天内可用' : (item.validStatus == 2 ? "领券次日起" + item.validPeriod + '天内可用' : (item.startAt.split(" ")[0] + "-" + item.endAt.split(" ")[0])),
      }
      this.typeStr = "spreadCoupon";
      this.showPoster = true;
    },
    goExchange(id) { //查看优惠券详情
      this.$routerGo(this, "push", { path: "/member/myExchange/exchangeCodeDetail", query: { redeemCodeId: id, fromType: '' } });
    },
  },
  activated() {
    isLoadding = false;
    this.customName = JSON.parse(localStorage.getItem("customName"));
    this.custNameMap = utilJs.getCustNameMap();
    this.isLoading = false;
    this.subTypeArr = [];
    this.hasSubType = false;
    this.subName = "";
    this.userExtend = {};
    this.listType = this.$route.query.listType;
    this.protocolInfoHasAgreed = null;
    this.popProtocols = false;
    this.selectProtocolsIndex = -1;
    let typeMap = new Map();
    typeMap.set(1, "基础资料");
    typeMap.set(2, "名额管理");
    typeMap.set(3, "好物分享");
    typeMap.set(4, "赠送记录");
    typeMap.set(5, "消耗明细");
    typeMap.set(6, "金额消耗明细");
    if (this.listType != 3) {
      setDocumentTitle(typeMap.get(Number(this.listType)));// eslint-disable-line
    } else {
      let url = 'members/agentApplyPage';
      utilJs.getMethod(global.apiurl + url, res => {
        let promoteMoneyName = res && res.agentConf && res.agentConf.promoteMoneyName ? res.agentConf.promoteMoneyName : '好物分享';
        setDocumentTitle(promoteMoneyName);// eslint-disable-line
      })
    }
    this.isShowPresent = false;
    if (!(this.listType == 3 && this.exchangeCodeList && this.exchangeCodeList.length > 0)) {
      this.page = 1;
      this.is_page = false;
      this.exchangeCodeList = [];
      this.spreadTabIndex = 0;
    }
    this.tabIndex = 2;
    this.courseList = [];
    this.supportType = [];
    this.isShowShareQuota = 0;
    this.defaultType = 0;
    this.arrIndex = 0;
    this.isSvipEnable = false;
    this.isVipEnable = false;
    this.isOpenVip = 0;
    this.isOpenSvip = 0;
    this.agentVersion = 0;
    this.useQuotaType = 1;
    this.agent = "";
    this.agentConf = '';
    this.formList = [];
    this.formArr = [];
    this.num = 60;
    this.yzText = "获取验证码";
    this.codeImgInfo = {};
    this.imgCode = '';
    this.code = '';
    this.isShowCode = "";
    this.isYz = true;
    let vtype = localStorage.getItem("vipType" + localStorage.getItem("userId")) || 1;
    if (vtype == undefined || (vtype != 3 && vtype < 5)) {
      this.$routerGo(this, "replace", {
        path: "/homePage/agent/agentIndex"
      });
    }
    utilJs.getMethod(`${global.apiurl}common/getAreaListForAgent`, res => {
      this.addressData = res.data;
      if (this.listType == 1 || this.listType == 2) {
        this.getApplyPage();
      } else if (this.listType == 4) {
        this.getMorePresent();
      } else if (this.listType == 5) {
        if (this.typeBar == 1) {
          this.quotaConsumeList = [];
          this.getQuotaConsumeList();
        } else {
          this.moneyConsumeList = [];
          this.getMoneyConsumeList();
        }
      } else if (this.listType == 6) {
        this.getMoneyConsumeList();
      }
    }, failRes => {
    });
    window.addEventListener('scroll', this.windowScrollAgentFunction);
    this.wechatShare();
  },
  deactivated() {
    this.popProtocols = false;
    window.removeEventListener('scroll', this.windowScrollAgentFunction);
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style>
.vux-cell-box:not(:first-child):before {
  border-top: none !important;
}
.c-mt4 {
  margin-top: 0.01rem;
}
.c-pl30 {
  padding-left: 0.75rem;
}
.c-pr38 {
  padding-right: 0.77rem;
}
.c-box-shadow {
  box-shadow: 0 4px 4px #ddd;
}
.c-box-shadow3 {
  box-shadow: 0 0.08rem 0.15rem rgba(204, 204, 204, 0.2);
  opacity: 1;
  border-radius: 0.25rem;
  -webkit-border-radius: 0.25rem;
}
.selectPicker >>> .weui-cell__ft,
.addressSelected >>> .weui-cell__ft {
  padding: 0 !important;
}
.selectPicker >>> .weui-cell,
.addressSelected >>> .weui-cell {
  padding: 0 !important;
}
.selectPicker >>> .weui-cell__ft:after,
.addressSelected >>> .weui-cell__ft:after {
  display: none !important;
}
.result >>> .vux-cell-value {
  color:#333 !important;
}
.courseShareholder {
  background: url('../../../../public/i/wap/coupon/cousetg.png') no-repeat;
  background-size: 100% auto;
  padding-top: 7.25rem;
}
.courseNoShareholder {
  background: url('https://kposshzcdn.ckjr001.com/admin/material/9_material_admin/image/assets/i/wap/newAreaAgent/coursetj.png') no-repeat;
  background-size: 100% auto;
  padding-top: 7.25rem;
}
.bt-wrapper, .wrapper-list {
  border-radius: .7rem .7rem 0 0;
}
.bg-ffefe6, .bt-wrapper, .wrapper-list {
  background-color: #FFEFE6;
}
.course-tgTrans {
  transform: translateY(-3.15rem);
}
.course-tjTrans {
  transform: translateY(-2.75rem);
}

.bg-brown {
  background: #C96000
}
.tab-icon {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  margin-right: 1.1rem;
  height: 0.1rem;
  width: 0.8rem;
  border-radius: 3px;
}
.fc-red {
  color: #FF320E;
}
.coupon-left {
  background: url("../../../../public/i/wap/coupon/shareholderVoucherPay.png") no-repeat 100%;
  background-size: 100% 100%;
}
.bg-gradient {
  background: linear-gradient(
    90deg,
    rgba(255,48,12,1) 0%,
    rgba(255,48,12,0.7) 100%
  );
  background: var(#FF0502);
}
.sticky {
  position: sticky;
  position: -webkit-sticky;
  top: 1.4rem;
}
.fixed {
  position: fixed;
  width: 100%;
  top: 0;
}
.minh800{min-height: 20rem;}
.vux-cell-box >>> .vux-cell-value {
  color: #333;
}
.search-bg {
  background: #f5f5f5;
}
</style>